// 目录列表导航
getCategoryList();
renderTransImg();
function getCategoryList(){
    // console.log(1111);
    ajax({
        url:'./php/index/getData.php',
        method:'post',
        dataType:'json',
        data:{
            opt:'getCategoryList',
        }
    }).then(res=>{
        let ulEle = document.querySelector(".category-list-wrapper");
        renderCategoryList(res,ulEle);
    });
}
function renderCategoryList(dataArr,ele){
    ele.innerHTML = '' ; 
    dataArr.forEach((item,key)=>{
        let aEle = document.createElement("a");	
        aEle.href = "javascript:;" ;
        aEle.setAttribute("myid",item['id']);
        aEle.innerHTML = `
            <div class="category-list-card" >
                <img src="./images/wwww.png" alt=""
                />${item['typeName']}
            </div>`;
        ele.appendChild(aEle);			
        aEle.onclick = function(){
            let typeId = this.getAttribute("myid");
            window.location.href = `./html/proList.html?typeId=${typeId}` ; 
        }
    });
}
function renderTransImg(){
    ajax({
        url:'./php/index/getData.php',
        method:'post',
        dataType:'json',
        data:{
            opt:'getTransImg'
        }
    }).then(res=>{
        let transImgEle = document.querySelector(".slider-container .transImg");
        // console.log(res);
        let ImgArr = res.map(item=>"./"+item['transImg']);
        new MySwiper(transImgEle,ImgArr);
    });	
}
let SearchEle1 = document.querySelector(".index-level-1 > .index-hot-products-wrapper .card-title-title span");
let containerEle1 = document.querySelector(".index-hot-products-list");

let SearchEle2 = document.querySelector(".brand .card-title-title span:nth-of-type(2)");
let containerEle2 = document.querySelector(".brand .brand");

let SearchEle3 = document.querySelector(".normal .card-title-title span");
let containerEle3 = document.querySelector(".normal .normal");

console.log(SearchEle2,containerEle2);

getProList(SearchEle1,containerEle1);
getProList(SearchEle2,containerEle2);
getProList(SearchEle3,containerEle3);

function getProList(eleSearch,container){
    let str = (eleSearch.innerHTML).trim();
    ajax({
        url:'./php/index/getData.php',
        method:'post',
        dataType:'json',
        data:{
            str,
            opt:'getProList',
        }
    }).then(res=>{
        renderProList1(container,res);
    });
}
function renderProList1(ele,dataArr){
    ele.innerHTML = '' ;
    dataArr.forEach((item,key)=>{
        let aEle = document.createElement("a");
        aEle.setAttribute("myid",item['id']);
        aEle.innerHTML = `
            <div class="index-product-card card-type-2">
                <img class="bottom-10" src="./${item['showImg']}" alt="" />
                <div class="desc-container">
                    <p class="double-line-desc bottom-10">
                        ${item['pDescribe']}
                    </p>
                    <p class="sale-number bottom-10">
                        销量${item['salesNum']}
                    </p>
                    <div class="price-container bottom-10">
                        <p class="after-coupon-price-type2">
                            <span>券后</span><span>￥${item['price']}</span>
                        </p>
                        <span class="origin-price">原价￥${item['price'] * 1.3 + 5.5}</span>
                    </div>
                </div>
            </div>` ;
        aEle.onclick = function (){
            let pid = this.getAttribute("myid");
            window.location.href = `./html/user/details.html?pid=${pid}` ;
        }
        ele.appendChild(aEle);
    });
}
function renderProList2(ele,dataArr){
    ele.innerHTML = '' ;
    dataArr.forEach(item=>{
        let divEle = document.createElement("div");
        divEle.setAttribute("myid",item['id']);
        divEle.className = "index-product-card card-type-2" ;
        divEle.innerHTML = `
            <a>
                <img src="./${item['showImg']}" alt="" class="bottom-10"  />
                <div class="desc-container" >
                    <p class="double-line-desc bottom-10">
                        ${item['pDescribe']}
                    </p>
                    <div class="price-container">
                        <p class="after-coupon-price-type2">
                            <span>券后</span><span>￥${item['price']}</span>
                        </p>
                        <span class="origin-price">原价￥${item['showImg'] * 1.3 + 5.5}</span>
                    </div>
                </div>
            </a>` ;
        ele.appendChild(divEle);
    });
}